import React from "react";
import { Tag } from "antd";
import type { ColumnsType } from "antd/es/table";

interface DataType {
  key: string;
  name: string;
  address: string;
  tags: string[];
}

export const columns: ColumnsType<DataType> = [
  {
    title: "姓名",
    dataIndex: "name",
    key: "name",
    ellipsis: true
  },
  {
    title: "地址",
    dataIndex: "address",
    key: "address",
    ellipsis: true
  },
  {
    title: "标签",
    key: "tags",
    dataIndex: "tags",
    ellipsis: true,
    render: (_, { tags }) => (
      <React.Fragment>
        {tags.map((tag) => (
          <Tag color={tag === "客户" ? "processing" : "cyan"} key={tag}>
            {tag}
          </Tag>
        ))}
      </React.Fragment>
    )
  }
];

export const data: DataType[] = [
  {
    key: "1",
    name: "杨怡伶",
    address: "中国上海市浦东新区陆家嘴街道银城中路501号上海中心大厦58层",
    tags: ["客户", "短视频达人"]
  },
  {
    key: "2",
    name: "吴淑霞",
    address: "杭州市西湖区文三路456号黄龙时代广场B座901室",
    tags: ["客户", "经销商"]
  },
  {
    key: "3",
    name: "郑威德",
    address: "上海市浦东新区世纪大道1500号东方大厦8层B区",
    tags: ["客户", "合伙人"]
  },
  {
    key: "4",
    name: "林婉婷",
    address: "南京市鼓楼区中山路321号紫峰大厦22层2205室",
    tags: ["客户", "合伙人"]
  },
  {
    key: "5",
    name: "赖雅娇",
    address: "苏州市工业园区星湖街666号苏州中心商场A座8层808室",
    tags: ["客户", "经销商"]
  },
  {
    key: "6",
    name: "许晓雯",
    address: "北京市朝阳区建国路88号现代城A座1203室",
    tags: ["客户", "合伙人"]
  },
  {
    key: "7",
    name: "陈建乐",
    address: "武汉市武昌区中北路88号楚河汉街万达广场C座18层",
    tags: ["客户"]
  }
];
